<template>
	<div >
		<el-dialog title="测试结果明细" width="90%" class="icon-dialog" :visible.sync="show" @open="open" :before-close="closeForm" append-to-body>
			<el-form :size="size" ref="form" :model="form" :label-width="$store.getters.device !== 'mobile'?'16%':'90px'">
 				 <el-row >
					<el-col :span="24">
						<el-form-item :label="$t('field.Testresult_fbillno')" prop="fbillno">
							<el-input :readonly="true" v-model="form.fbillno" >
							</el-input>
						</el-form-item>
					</el-col>
				 </el-row>
	 				 <el-row >
					<el-col :span="24">
						<el-form-item :label="$t('field.Testresult_fdevice')" prop="fdevice">
							<el-input :readonly="true" v-model="form.fdevice" autoComplete="off" clearable  :placeholder="$t('system.pleaseInput',{title:$t('field.Testresult_fdevice')})">
							</el-input>
						</el-form-item>
					</el-col>
				 </el-row>
	 				 <el-row >
					<el-col :span="24">
						<el-form-item :label="$t('field.Testresult_fisvs')" prop="fisvs">
							<el-input :readonly="true" v-model="form.fisvs" autoComplete="off" clearable  :placeholder="$t('system.pleaseInput',{title:$t('field.Testresult_fisvs')})">
							</el-input>
						</el-form-item>
					</el-col>
				 </el-row>
	 				 <el-row >
					<el-col :span="24">
						<el-form-item :label="$t('field.Testresult_fvc')" prop="fvc">
							<el-input :readonly="true" v-model="form.fvc" autoComplete="off" clearable  :placeholder="$t('system.pleaseInput',{title:$t('field.Testresult_fvc')})">
							</el-input>
						</el-form-item>
					</el-col>
				 </el-row>
	 				 <el-row >
					<el-col :span="24">
						<el-form-item :label="$t('field.Testresult_fcompletetime')" prop="fcompletetime">
							<el-input :readonly="true" v-model="form.fcompletetime" autoComplete="off" clearable  :placeholder="$t('system.pleaseInput',{title:$t('field.Testresult_fcompletetime')})">
							</el-input>
						</el-form-item>
					</el-col>
				 </el-row>
        <el-row >
          <el-col :span="24">
            <el-form-item :label="$t('field.Testresult_fcornermura')" prop="fcornermura">
              <el-input :readonly="true" v-model="form.fcornermura" autoComplete="off" clearable  :placeholder="$t('system.pleaseInput',{title:$t('field.Testresult_fcornermura')})">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row >
          <el-col :span="24">
            <el-form-item :label="$t('field.Testresult_fblooming')" prop="fblooming">
              <el-input :readonly="true" v-model="form.fblooming" autoComplete="off" clearable  :placeholder="$t('system.pleaseInput',{title:$t('field.Testresult_fblooming')})">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row >
          <el-col :span="24">
            <el-form-item :label="$t('field.Testresult_fcrosstalk')" prop="fcrosstalk">
              <el-input :readonly="true" v-model="form.fcrosstalk" autoComplete="off" clearable  :placeholder="$t('system.pleaseInput',{title:$t('field.Testresult_fcrosstalk')})">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row >
          <el-col :span="24">
            <el-form-item :label="$t('field.Testresult_fborder')" prop="fborder">
              <el-input :readonly="true" v-model="form.fborder" autoComplete="off" clearable  :placeholder="$t('system.pleaseInput',{title:$t('field.Testresult_fborder')})">
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
<!--      <el-button type="primary" icon="el-icon-plus"  size="mini" @click="xinzenghang" >增加</el-button>-->
      <el-table :data ="list" stripe  style="width: 100%">
        <el-table-column prop="fbillno" align="center" label="序号" width="120">{{form.fbillno}}</el-table-column>
        <el-table-column prop="fqianru" align="center" label="嵌入式板" >{{form.fqianru}}</el-table-column>
        <el-table-column prop="fepaper" align="center" label="电子纸" >{{form.fepaper}}</el-table-column>
        <el-table-column prop="fwendu" align="center" label="温度" >{{form.fwendu}}</el-table-column>
        <el-table-column prop="fboxing" align="center" label="波形" >{{form.fboxing}}</el-table-column>
        <el-table-column prop="fl1" align="center" label="l1" >{{form.fl1}}</el-table-column>
        <el-table-column prop="fstate" align="center"label="状态OK/NG" >{{form.fstate}}</el-table-column>
        <el-table-column prop="ftupian" align="center"label="图片信息" >
          <div v-if="form.ftupian_table && form.ftupian_table.indexOf('[{') != -1" class="demo-image__preview">
            <el-image style="margin-right:5px" v-for="(item,i) in JSON.parse(form.ftupian_table)"  class="table_list_pic" :src="item.url" :key="i"  :preview-src-list="[item.url]"></el-image>
          </div>
        </el-table-column>
<!--        <el-table-column prop="operate" align="center"label="操作" >-->
<!--          <el-button-->
<!--              size="mini"-->
<!--              type="success"-->
<!--              icon="el-icon-save"-->
<!--              @click="handlesaveExperience(scope.$index, scope.row)">查看-->
<!--          </el-button>-->
<!--        </el-table-column>-->

      </el-table>
<!--      <div id="lineChart" style="width: 100%;height: 300px;"></div>-->
      <div id="childChart" style="width: 100%;height: 300px; " ></div>
		</el-dialog>
	</div>
</template>
<script>
import { update } from '@/api/app/testresult'
import ImagesUpload from '@/components/common/ImagesUpload.vue'
import echarts from "echarts/lib/echarts";

export default {
	name:'testresultupdate',
	components: {
    ImagesUpload,
	},
	props: {
		show: {
			type: Boolean,
			default: false
		},
		size: {
			type: String,
			default: 'small'
		},
		info: {
			type: Object,
		},
	},
	data(){
		return {
		    dialog:{
			},
      list:[{
        fid:'',
        fqianru:'',
        fepaper:'',
        fwendu :'',
        fboxing:'',
        fl1:'',
        fstate:'',
        operate:'',
      }],
			form: {
			   fbillno:'',
			   ftype:'',
			   fdevice:'',
			   ftray:'',
			   fqianru:'',
			   fisvs:'',
			   fvc:'',
			   fstate:'',
			   fcompletetime:'',
			   fepaper:'',
			   fwendu:'',
			   fboxing:'',
        fcornermura:'',
        fblooming:'',
        fcrosstalk:'',
        fborder:'',

			},
		    initial:{},        
			loading:false,

		}
	},
	watch:{
		show(val){
			if(val){
			}
		}
	},
  mounted() {
    this.drawLine();
  },
  created() {
    setTimeout(() => {
      this.drawLine()
    }, 6000)
  },
  methods: {
    async drawLine() {
      //console.log("调用折线图1")
      let myChart = echarts.init(document.getElementById('childChart'));
      //console.log("调用折线图2")
      //console.log(myChart)
      // 绘制图表
      myChart.setOption({
        xAxis: {
          data: ['A', 'B', 'C', 'D', 'E']
        },
        yAxis: {
          type: 'value',
          name: '温度',
          position: 'left',
          min: -50,
          max: 50,
          axisLabel: {
            formatter: '{value} °C'
          }
        },
        series: [
          {
            name: '温度',
            data: [-20, 22, 35, 23, 19],
            type: 'line',
            label: {
              show: true,
              position: 'bottom',
              textStyle: {
                fontSize: 10
              }
            }
          }
        ]
      });
    },
		open(){
			this.form = this.info
		},
		submit(){
			this.$refs['form'].validate(valid => {
				if(valid) {
					this.loading = true
					update(this.form).then(res => {
						if(res.status == 200){
							this.$message({message: this.$t('system.success'), type: 'success'})
							this.$emit('refresh_list')
							this.closeForm()
						}
					}).catch(()=>{
						this.loading = false
					})
				}
			})
		},
		closeForm(){
			this.$emit('update:show', false)
			this.loading = false
			if (this.$refs['form']!==undefined) {
				this.$refs['form'].resetFields()
			}
		},
	}
}
</script>
<style scoped lang="scss">
@import '@/assets/scss/common.scss'
</style>
